<template>
  <div v-if="operationAuth">
    <page-header
      :title="$t('m.Station_Device')"
      :has-return="false"
    >
    </page-header>
    <div class="container">
      <div class="list_div">
        <div class="page_list_div">
          <el-form class="page_list_top" label-position="right">
            <el-form-item :label="$t('m.search_') + ':'" class="page_list_top">
              <el-input
                :placeholder="
                  [
                    $t('m.Station_SN'),
                    $t('m.Franchisee_belong'),
                    $t('m.Agency_Details_Shop2')
                  ].join(' / ')
                "
                prefix-icon="el-icon-search"
                style="width:300px;"
                clearable
                v-model="params.search"
              />
            </el-form-item>
            <el-form-item class="page_list_top page_list_search">
              <el-button
                class="search_button reset_button"
                @click="searchClick('')"
                >{{ $t('m.search_') }}</el-button
              >
            </el-form-item>
            <el-form-item class="page_list_top page_list_search">
              <el-button class="reset_button" @click="searchClick('1')">{{
                $t('m.refresh')
              }}</el-button>
            </el-form-item>
            <el-form-item class="page_list_top " v-if="permissionsId(243)">
              <el-button class="reset_button" @click="exportOperationt">{{
                $t('m.exports')
              }}</el-button>
            </el-form-item>
          </el-form>
        </div>
        <el-divider class="el_divider"></el-divider>
        <div class="el_table_div">
          <el-table :data="page.records">
            <el-table-column
              prop="cabinetNo"
              :label="$t('m.Station_SN')"
              min-width="150"
            >
            </el-table-column>
            <el-table-column
              prop="agentName"
              :label="$t('m.Franchisee_belong')"
              min-width="120"
            >
              <template slot-scope="scope">
                <div>{{ scope.row.agentName | strFormat }}</div>
              </template>
            </el-table-column>
            <el-table-column
              prop="branchName"
              :label="$t('m.Agency_Details_Shop2')"
              min-width="120"
            >
              <template slot-scope="scope">
                <div>{{ scope.row.branchName | strFormat }}</div>
              </template>
            </el-table-column>
            <el-table-column
              prop="branchAddress"
              :label="$t('m.Shop_Details_Address')"
              min-width="120"
            >
              <template slot-scope="scope">
                <div>{{ scope.row.branchAddress | strFormat }}</div>
              </template>
            </el-table-column>
            <el-table-column
              prop="todayOrder"
              :label="$t('m.Station_Total_Order')"
              min-width="120"
            >
            </el-table-column>
            <el-table-column
              prop="accumulativeOrder"
              :label="$t('m.Users_Details_Orders')"
              min-width="120"
            >
            </el-table-column>
            <el-table-column
              prop="todayIncome"
              :label="$t('m.Station_Total_Revenue')"
              min-width="120"
            >
              <template slot-scope="scope">
                <div>{{ scope.row.todayIncome | amountFormat }}</div>
              </template>
            </el-table-column>
            <el-table-column
              prop="accumulativeRevenue"
              :label="$t('m.Station_Accumulative_Revenue')"
              min-width="120"
            >
              <template slot-scope="scope">
                <div>{{ scope.row.accumulativeRevenue | amountFormat }}</div>
              </template>
            </el-table-column>
            <el-table-column
              prop="runDays"
              :label="$t('m.Station_Run_Days')"
              min-width="120"
            >
            </el-table-column>
            <emptydata
              slot="empty"
              v-if="!page.records || page.records.length == 0"
            />
          </el-table>
          <el-pagination
            background
            :page-sizes="[10, 20, 30, 40, 50]"
            :page-size="page.size"
            :current-page.sync="page.current"
            layout="total, sizes, prev, pager, next, jumper"
            :pager-count="5"
            :total="page.total"
            class="el_pagination"
            @size-change="changePageSize"
            @current-change="changePageNum"
            v-show="page.total > 0"
          >
          </el-pagination>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import page from '@/mixins/page'
export default {
  mixins: [page],
  name: 'operation',
  data () {
    return {
      params: {
        search: '', //模糊查询
        cabinetType:''
      },
      operationAuth: this.permissionsId(46) //设备运营权限
    }
  },

  created () {
    if (!this.operationAuth) {
      return
    }
    this.getOperationLists()
  },
  mounted () {},
  methods: {
    //获取设备运营列表
    getOperationLists () {
      this.$api.equipment.operationList(this.params, this.page).then(res => {
        if (this.$ok(res)) {
          this.page = res.data
        }
      })
    },
    // 搜索/重置
    searchClick (reset) {
      // 是否重置
      let size = this.page.size
      this.page = this.$options.data.call(this).page
      if (reset) {
        this.params = this.$options.data.call(this).params
      } else {
        this.page.size = size
      }
      this.getOperationLists()
    },
    // 每页数
    changePageSize (val) {
      this.page.current = 1
      this.page.size = val
      this.getOperationLists()
    },
    // 当前页
    changePageNum (val) {
      this.page.current = val
      this.getOperationLists()
    },

    //导出列表
    exportOperationt () {
      this.$openLoading()
      this.$api.equipment.getExportOperationtList(this.params).then(res => {
        window.downExcel(res, this.$t('m.Station_Device'))
        this.$closeLoading()
      })
    }
  }
}
</script>
